<template>
  <div>
    <van-dropdown-menu>
        <van-dropdown-item  disabled title="全部"  />
        <van-dropdown-item v-model="value1" title="价格" :options="option1" @change='classPrice'/>
        <van-dropdown-item v-model="value2" title="分类" :options="classList" @change='classId'/>
    </van-dropdown-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {
        value1:'',//价格下拉选项
        // 价格下拉菜单
        option1: [
            { text: '从高到低', value: 'desc' },
            { text: '从低到高', value: 'asc' },
        ],
    }
  },
  computed:{
      value2:{
        get(){
          let id = ''
          for(var i=0;i<this.classList.length;i++){
            if(this.classList[i].checked){
              id=this.classList[i].value
              break
            }
          }
          return id
        },
        set(){}
      }
  },
  props:['classList'],
  methods:{
    classPrice(val){
      console.log(val);
      this.$emit('classPrice',val)
    },
    classId(val){
      this.$emit('classId',val)
    }
  }
}
</script>

<style>

</style>